iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 7
0
Modern Web

寫JS30天系列 第 7

JS 30 - 07 - Array Cardio Part II

  • 分享至 

  • xImage
  •  

今天有幾題要來解決,首先我們拿到了一個裝滿許多個人資料的 array ,資料如下

const people = [{
        name: 'Wes',
        year: 1988
    },
    {
        name: 'Kait',
        year: 1986
    },
    {
        name: 'Lux',
        year: 2015
    },
    {
        name: 'Irv',
        year: 1970
    }
];

是否所有人都大於19歲

every()

every() 可以檢查所有的陣列是否符合條件,這僅會回傳一個值 true or false,可以用來檢查陣列中的內容是否符合特定條件。

const everyoneOlderThanNineteen = people.every(person => ((new Date()).getFullYear()) - person.year > 19);
const everyoneOlderThanNineteen = people.every(person => {
    const currentYear = (new Date()).getFullYear();
    if (currentYear - person.year > 19) {
        return true;
    }
});
console.log(everyoneOlderThanNineteen);

整理一下

const everyoneOlderThanNineteen = people.every(person => ((new Date()).getFullYear()) - person.year > 19);
console.log(everyoneOlderThanNineteen);

是否有人大於19歲

some()

some()every() 非常接近,都是回傳 true or false,差異僅在 every() 需完全符合,some() 僅需要部分符合,所以稍微改一下即可

const someoneOlderThanNineteen = people.some(person => ((new Date()).getFullYear()) - person.year > 19);
console.log(someoneOlderThanNineteen);

找到 id 為823423

find()

find()filter() 很像,但 find() 只會回傳第一次為 true 的值,只會傳一個。

const comment = comments.find(comment => comment.id === 823423);
console.log(comment);

找到 id 為823423的 index,並刪除該筆資料

findindex()

findindex()find() 幾乎一模一樣,差別是findindex()是回傳 index

const index = comments.findIndex(comment => comment.id === 823423);
comments.splice(index, 1);
console.table(index, comments);

Array.prototype.splice()

Array.splice()是可以從 array 中刪除特定的 element

arr.splice(index,deleteCount);

從 index 開始,往後刪除 deleteCount 個 element ,這個方法會更改到原陣列

如果不想要更改到原陣列可以使用 .slice()

.slice()

給起始值和結束值,剩下的切掉
Array.slice(beginSlice[, endSlice]),如果沒有給endSlice會直接切到結尾

使用Array.prototype.slice()刪除people陣列中,第一個小於20歲的人

findIndex() 找到第一個小於20歲的人,然後用 slice()切成兩個片段,再使用...展開,組成一個新的 array

const getIndex = people.findIndex(person => new Date().getFullYear() - person.year < 20);
const newPeople = [
    ...people.slice(0, getIndex),
    ...people.slice(getIndex + 1)
]
console.log(people);
console.log(newPeople);

上一篇
JS 30 - 06 - Ajax Type Ahead
下一篇
JS 30 - 08 - Fun with HTML5 Canvas
系列文
寫JS30天30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言